<template>
	<view class="container">
		<view class="title">今天</view>
		<view v-for="(item, index) in data" :key="index" class="notice-item">
			<view class="notice-title">
				{{ item.alarmtitle }}
			</view>
			<view class="notice-content">
				<view class="label">牲畜编号</view>
				<view class="imei">IMEI: {{ item.liveid }}</view>
			</view>
			<i class="iconfont icon-xiangyoujiantou icon"></i>
		</view>
	</view>
</template>

<script setup>
	import {
		ref,onMounted
	} from 'vue'
	import {message} from '@/utils/api/Home.js'
	const data=ref(null)
	
	const list = async ()=>{
		let res = await message()
		data.value=res.data
	}
	
	onMounted(()=>{
		list()
	})
</script>

<style lang="scss" scoped>
	@import '@/static/iconfont/iconfont.css';
	.container {
		padding: 10px;
		background-color: #F3F5F8;
	}

	.title {
		font-size: 16px;
		color: #666;
		margin-bottom: 10px;
	}

	.notice-item {
		border-radius: 20rpx;
		padding: 20px 20px;
		margin-bottom: 10px;
		background-color:#FFFFFF ;
		position: relative;
	}

	.notice-title {
		font-size: 14px;
		border-radius: 5px;
		color:  #f56c6c;
	}

	.label {
		font-size: 12px;
	}

	.imei {
		font-size: 14px;
		color: #999;
	}
	
	.icon{
		font-size: 40rpx;
		position: absolute;
		right: 20px;
		top: 40px
	}
</style>